<template>
<div class="search-wrapper">
	<svg-icon icon-class="search" color="#B7B7B7"></svg-icon>
	<div class="search-text">{{searchText}}</div>
</div>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue'
export default defineComponent({
	setup(props, context){
		const searchText = ref('山姆会员商店优惠商品')

		return {
			searchText
		}
	}
})
</script>
<style lang="scss" scoped>
@import '@/styles/viriables.scss';
@import '@/styles/mixins.scss';
	.search-wrapper{
		box-sizing: border-box;
		margin: 0 18px 12px;
		background-color: $bg-color;
		font-size: $fnSize14;
		color: $secondary-font-color;
		padding:8px 16px;
		display: flex;
		border-radius: 16px;
		.search-text{
			margin-left: 10px;
			flex: 1;
		}
	}
</style>